<template>
	<div class="user">
		<div class="common-form">买送设置</div>
		<div class="product-content">
			<el-form ref="form" :model="form" :rules="formRules" label-width="150px">
				<el-form-item label="名称" prop="name" :rules="[{required: true,message: ' '}]">
					<el-input type="text" disabled v-model="form.name" :placeholder="请输入活动名称"
						class="max-w460"></el-input>
				</el-form-item>
				<el-form-item label="活动状态">
					<el-radio-group v-model="form.status" disabled>
						<el-radio :label="1">开启</el-radio>
						<el-radio :label="0">关闭</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="活动时间" :rules="[{ required: true, message: ' ' }]" prop="start_time">
					<el-date-picker disabled v-model="form.start_time" type="datetime"
						value-format="YYYY-MM-DD HH:mm:ss" placeholder="选择开始日期">
					</el-date-picker>
					<span>-</span>
					<el-date-picker disabled v-model="form.end_time" type="datetime" value-format="YYYY-MM-DD HH:mm:ss"
						placeholder="选择结束日期">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="赠送类型">
					<el-radio-group v-model="form.send_type" disabled>
						<el-radio :label="10">单次</el-radio>
						<el-radio :label="20">倍数赠送</el-radio>
					</el-radio-group>
					<div class="gray9 f12">单次为达到赠送条件只赠送一次；倍数赠送为买2件A商品送1件B商品，买4件A商品送2件B商品</div>
				</el-form-item>
				<el-form-item v-if="form.send_type==20" label="最大赠送倍数" prop="max_times"
					:rules="[{required: true,message: ' '}]">
					<el-input type="number" min="1" disabled v-model="form.max_times" :placeholder="请输入最大赠送倍数"
						class="max-w460"></el-input>
					<div class="gray9 f12">赠送类型为倍数赠送时的最大赠送倍数，最小数值为1</div>
				</el-form-item>
				<el-form-item label="排序" prop="sort" :rules="[{required: true,message: ' '}]">
					<el-input type="text" disabled v-model="form.sort" placeholder="请输入排序" class="max-w460"></el-input>
					<div class="tips">值越小越靠前</div>
				</el-form-item>
				<div class="common-form">购买商品</div>
				<el-form-item label="">
					<div class="gray9 f12">满足任一条件赠送</div>
					<el-table :data="limitProdcutData" style="width: 60%">
						<el-table-column prop="product_id" label="商品id">
						</el-table-column>
						<el-table-column prop="product_name" label="商品名称">
						</el-table-column>
						<el-table-column prop="product_num" label="数量" :rules="[{required: true,message: ' '}]">
							<template #default="scope">
								<el-input type="number" disabled v-model="scope.row.product_num" placeholder=""
									min="1"></el-input>
							</template>
						</el-table-column>
					</el-table>
				</el-form-item>
				<div class="common-form">赠送商品</div>
				<el-form-item label="">
					<div class="gray9 f12">活动商品（拼团秒杀砍价等...）不参与赠送</div>
					<el-table :data="prodcutData" style="width: 60%">
						<el-table-column prop="product_id" label="商品id">
						</el-table-column>
						<el-table-column prop="product_name" label="商品名称">
						</el-table-column>
						<el-table-column prop="product_num" label="规格">
							<template #default="scope">
								<span v-if="scope.row.spec_type==20&&scope.row.spec_sku_id">
									{{scope.row.product_attr}}
								</span>
								<span :rules="[{ required: true, message: ' ' }]"
									v-if="scope.row.spec_type==20&&!scope.row.spec_sku_id">
									<el-button size="small" icon="Plus" @click="specsFunc(scope.$index, scope.row)">选择规格
									</el-button>
								</span>
								<span v-if="scope.row.spec_type==10">单规格</span>
							</template>
						</el-table-column>
						<el-table-column prop="product_num" label="数量" :rules="[{required: true,message: ' '}]">
							<template #default="scope">
								<el-input type="number" disabled v-model="scope.row.product_num" placeholder=""
									min="1"></el-input>
							</template>
						</el-table-column>
					</el-table>
				</el-form-item>
				<el-form-item label="审核状态：" :rules="[{ required: true, message: '选择审核状态' }]" prop="audit_status">
					<el-radio-group v-model="form.audit_status" :disabled="status!=10">
						<el-radio :label="10">待审核</el-radio>
						<el-radio :label="20">通过</el-radio>
						<el-radio :label="30">未通过</el-radio>
					</el-radio-group>
				</el-form-item>
			</el-form>
			<!--提交-->
			<div class="common-button-wrapper">
				<el-button type="info" @click="gotoBack">返回</el-button>
				<el-button type="primary" @click="onSubmit" :loading="loading" v-if="status==10">提交</el-button>
			</div>
		</div>
	</div>
</template>
<script>
	import {
		detailBuy,
		editBuy
	} from "@/api/buy.js";
	import {
		formatModel
	} from '@/utils/base.js';
	export default {
		components: {},
		data() {
			return {
				form: {
					buy_id: 0,
					name: '',
					status: 1,
					start_time: '',
					end_time: '',
					sort: '',
					limit_product: [],
					product_ids: [],
					send_type: '',
					max_times: '',
					audit_status: ''
				},
				tableData: [],
				prodcutData: [],
				limitProdcutData: [],
				loading: false,
				/*是否打开选择商品*/
				isproduct: false,
				exclude_ids: [],
				/*是否打开选择商品*/
				islimitproduct: false,
				/*左边长度*/
				formLabelWidth: '120px',
				curProduct: {
					product_id: 0
				},
				SpecExcludeIds: [],
				isspecs: false,
				limit_exclude_ids: [],
				status: ''
			};
		},
		created() {
			/*获取数据*/
			this.getData();
		},
		methods: {
			/*获取数据*/
			getData() {
				let self = this;
				let id = self.$route.query.buy_id;
				detailBuy({
					buy_id: id
				}, true).then(data => {
					self.form = formatModel(self.form, data.data.model);
					self.form.product_ids = [];
					self.prodcutData = data.data.model.product_ids;
					self.limitProdcutData = data.data.model.limit_product;
					self.form.start_time = data.data.model.start_time_text;
					self.form.end_time = data.data.model.end_time_text;
					self.status = data.data.model.audit_status;
				}).catch(error => {});
			},
			/*提交表单*/
			onSubmit() {
				let self = this;
				let param = {};
				param.buy_id = self.form.buy_id;
				param.audit_status = self.form.audit_status;
				self.$refs.form.validate((valid) => {
					if (valid) {
						self.loading = true;
						editBuy(param, true).then(data => {
								self.loading = false;
								if (data.code == 1) {
									ElMessage({
										message: data.msg,
										type: 'success'
									});
									self.$router.push('/plus/buyactivity/index');
								} else {
									self.loading = false;
								}
							})
							.catch(error => {
								self.loading = false;
							});
					}
				});
			},
			/*返回上一页面*/
			gotoBack() {
				this.$router.back(-1);
			},
		}
	};
</script>